
<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
	<title>icell</title>
	<link rel="stylesheet" href="jquery.ui/jquery-ui-1.8.23.custom.css"></link>
	<link rel="stylesheet" href="style.css"></link>
	<script src="jquery.js"></script>
	<script src="jquery.ui/jquery-ui-1.8.23.custom.min.js"></script>
	<script src="jquery.json.js"></script>
	<script src="bin/common.js"></script>
	<script src="bin/icell-html5.js"></script>
	<script src="users.js"></script>
	<script src="http://tjs.sjs.sinajs.cn/open/api/js/wb.js?appkey=4022031959" type="text/javascript" charset="utf-8"></script>
	<style>
	</style>
</head>
<body>
<div id="content"></div>  
	
	<div style="position:absolute;left:400px">
		<canvas id="debugCanvas" style="border:1px solid #EDEDED;display:none" width="400" height="300"></canvas>
	</div>
	<div id="stage" style="position:absolute;">
		<div id="editor-panel-space" style="float:left;width:0px;background-color:#efefef"></div>
		<canvas id="gameCanvas" style="float:left" width="800" height="450"></canvas>
	</div>
	
	<!-- 蛋白质合成工厂 -->
	<div id="dialog-protein-composite" style="display:none">
		<h2>蛋白质工厂</h2>

		<div>
			原料
			<span style="color:red" class="aminoacid-num-red"></span>
			<span style="color:yellow" class="aminoacid-num-yellow"></span>
			<span style="color:blue" class="aminoacid-num-blue"></span>
		</div>
		
		<hr />
		
		<div>
			<div id="protein-formulas-outer"></div>
			<div id="protein-composition-formula-template" class="protein-formula" style="display:none;">
				<button onclick="ins(yc.inner.building.ProteinFactory).singleComposite( $(this).parent().data('formula') )" style="float:left">合成</button>
				<button onclick="ins(yc.inner.ProteinFormulas).toggle( $(this).parent().data('formula').name )" class='protein-formula-togglebtn' style="float:left">自动</button>
				<span class='formula-display' style="float:left;width:120px"></span>
				<span class="formula-msg" style="display:none">暂停</span>
				<div class="protein-composite-progress" style="width:150px;height:10px; float:left"></div>
				<div style="clear:both"></div>
			</div>
		</div>
		
		<div>
			<button onclick="$('#dialog-protein-composite').hide()" style="float:right">关闭</button>
		</div>
		
	</div>
	
	
	
	<div id="debug-output" style="position: absolute;width:200px;right:300px;">
		<div id="player-status"></div>
	</div>
	
	<div id='menu-inner-layer-zoom' style="float:right;position: absolute;display:none;">
		<button title="回到主菜单" onclick=" if(!confirm('确定要放弃当前游戏，退回到主菜单吗？')) return ; cc.Director.getInstance().replaceScene( ins(yc.MainScene) )">主菜单</button>
	</div>
	
	<!-- 建造菜单 -->
	<div id="bulding-create-menu" class="bulding-menu" style="display:none;position:absolute ;">
	
		<div>
			<h3>建设</h3>
			<button class='btn-close'>关闭</button>
		</div>
		
		<div id='bulding-create-items' class='bulding-items'></div>
		
	</div>
	<div class="bulding-create" id="bulding-create-template" style='display:none'>
		<b class='title'></b>
		<div class='description'></div>
		<div class='cost'></div>
		<span class='message' style='color:red'></span>
		<button class='create'>购买</button>
	</div>
	
	<!-- 升级菜单 -->
	<div id="bulding-upgrade-menu" class="bulding-menu" style="display:none;position:absolute ;">
	
		<div>
			<h3>升级</h3>
			<button class='btn-close'>关闭</button>
		</div>
		
		<div id="bulding-upgraders-outer" class='bulding-items'></div>
		
		<hr />
		<div>
			<button id='btn-demolish'>拆除</button>
			可回收：<span id='cost-recovering'></span>
		</div>
	</div>
	
	<div class="bulding-upgrader" id="bulding-upgrader-template" style='display:none'>
		<b class='title'></b>
		<span class='newLv'>Lv </span>
		<div class='description'></div>
		<div class='detail'></div>
		<div class='cost'></div>
		<button class='upgrade'>Upgrade</button>
	</div>
	
	<!-- 击杀boss奖励菜单 -->
	<div id="dialog-killboss-reward" style="display:none">
		
		<h3>奖励</h3>
		
		<div>
			你成功击杀了Boss病毒，请选择一个基因作为奖励，然后进入下一个关卡。
		</div>
		
		<div id="reward-genes-outer"></div>
		
		<div id="reward-gene-template" style="display:none" class="reward-gene">
			<h4 class="title"></h4>
			<div class="description"></div>
			<button class='btn-select'>选择</button>
		</div>
	</div>
	
	<!-- 关卡编辑器 -->
	<div id='world-editer' style='display:none;font-size:12px;'>
	
		<div id='worldediter-message'></div>
		
		<div id='tabs-world-editer'>
			<ul>
				<li><a href="#panel-world">世界</a></li>
				<li><a href="#panel-stains">地形</a></li>
				<li><a href="#panel-pinups">贴图</a></li>
				<li><a href="#panel-roles">角色</a></li>
				<li><a href="#panel-cell">细胞</a></li>
			</ul>
			
			
			<div id='panel-world'>
				<div>
					<button onclick="ins(yc.ui.editer.WorldEditer).refresh();">刷新</button>

					<button onclick="yc.settings.outer.box2d.dbg=!yc.settings.outer.box2d.dbg; $('#debugCanvas').toggle()">Debug Draw</button>
					
					<label><input type="checkbox" onchange="yc.settings.player.nohurt=$(this).attr('checked')?true:false" checked />无敌</label>
					<label><input type="checkbox" onchange="yc.settings.player.stealth=$(this).attr('checked')?true:false" checked />隐身</label>
					<br />
					<button onclick="ins(yc.outer.Cell).spurt(100)">冲刺</button>
					x:<input value="" id='ipt-pos-x' style='width:40px' />
					y:<input value="" id='ipt-pos-y' style='width:40px' />
					<button onclick="ins(yc.outer.Cell).jump(parseInt($('#ipt-pos-x').val()),parseInt($('#ipt-pos-y').val()))">跃迁</button>
				</div>
				<div>
					最大倍数:<input value="1" id='maxZoom' style='width:40px' />
					最小倍数:<input value="0.1" id='minZoom' style='width:40px' />
				</div>

				<div>
					<button onclick="cc.Director.getInstance()._runningScene.initWithScript(yc.GameScene.prototype.scriptDemo)">test</button>
				</div>
				<div>
					<div>世界边界</div>
					<div>
						左：<input value="-1000" id="scene_lft" />
						上：<input value="1000" id="scene_top" />
					</div>
					<div>
						右：<input value="1000" id="scene_rgt" />
						下：<input value="-1000" id="scene_btm" />

						<button onclick="ins(yc.ui.editer.WorldEditer).setSceneBorder();return false;">应用</button>
					</div>
					
				</div>

				<div>
					<textarea id="txt-level-script" style="width:370px; height:200px"></textarea>
					<br />

					<button onclick="$('#txt-level-script').val( $.toJSON(cc.Director.getInstance().getRunningScene().exportScript()) )">导出脚本</button>
					<button onclick="cc.Director.getInstance().getRunningScene().initWithScript( $.evalJSON($('#txt-level-script').val() ) ); ins(yc.ui.editer.WorldEditer).refresh();">导入脚本</button>
				</div>

				<div>
					<button onclick="saveWorldToServer()">保存到服务器</button>
					<div id="saveWorldMsg"></div>
				</div>

			<iframe id="saveIframe" src="iframeSaveWorld.html" width="0" height="0" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no" allowtransparency="yes">
            </iframe>
			</div>
		
			<div id='panel-stains'>
				<button onclick="ins(yc.ui.editer.WorldEditer).stain.refreshStains()">刷新</button>
				<button onclick="ins(yc.ui.editer.WorldEditer).stain.createStain()">+ 污渍</button>
				<button onclick="ins(yc.ui.editer.WorldEditer).stain.removeStain()">- 污渍</button>
				| <label><input type="checkbox" onchange="yc.settings.outer.stain.dbg=$(this).attr('checked')?true:false" checked />debug info</label>
				<div>
					<div style="float:left;">
						污渍：<br />
						<select size="22" id="lst-stains" style="width:120px"></select>
					</div>

					<div style="float:left; margin-left:20px">
						x:<input id='ipt-stain-x' style='width:70px' value='' />
						y:<input id='ipt-stain-y' style='width:70px' value='' />
						<br />

						<select id="sel-stain-bodyType">
							<option value='0'>静止</option>
							<option value='2'>可动</option>
						</select>

						角度： <input id='ipt-stain-rotation' style='width:60px' value='' /><br />
						
						<button onclick="ins(yc.ui.editer.WorldEditer).stain.locateStain()">定位</button>
						<button onclick="ins(yc.ui.editer.WorldEditer).stain.stopStainMoving()">停止移动</button>
						<button onclick="ins(yc.ui.editer.WorldEditer).stain.stopStainRotation()">停止旋转</button>

						<hr />

						<div>

							<b>形状：</b>
							<button onclick="ins(yc.ui.editer.WorldEditer).stain.createStainShape()">+ 形状</button>
							<button onclick="ins(yc.ui.editer.WorldEditer).stain.removeStainShape()">- 形状</button><br />
							<select size="3" id="lst-stain-shapes" style="width:150px"></select><br />

							密度<input id='ipt-stain-shape-density' style='width:20px' value='' />
							弹性<input id='ipt-stain-shape-restitution' style='width:20px' value='' />
							摩擦<input id='ipt-stain-shape-friction' style='width:20px' value='' />
							<br />

							染色<input id='ipt-stain-shape-color' style='width:100px' value='' /><br />
							边界色<input id='ipt-stain-shape-border-color' style='width:100px' value='' /><br />
							

							文本<input id='ipt-stain-shape-text' style='width:150px' /><br />
							文本样式<input id='ipt-stain-shape-text-style' title="污渍上绘制文本的样式" style='width:120px' value='' /> <br />
							文本颜色<input id='ipt-stain-shape-text-color' title="污渍上绘制文本的颜色" style='width:100px' value='' /><br />
							贴图<input id="ipt-stain-shape-img" style='width:140px' value='' />
							<br />
							<label>
								<input id="ipt-stain-shape-img-tile" type="checkbox" checked="checked" />平铺贴图
							</label>

						</div>

						<hr />
						
						<div>
							<b>多边形顶点：</b>
							<button onclick="ins(yc.ui.editer.WorldEditer).stain.createStainPoint()">+ 点</button>
							<button onclick="ins(yc.ui.editer.WorldEditer).stain.removeStainPoint()">- 点</button>
							<br />
							<select size="6" id="lst-stain-points" style="width:150px"></select><br />

							顶点坐标：<br />
							x:<input id='ipt-stain-point-x' style='width:50px' value='' />
							y:<input id='ipt-stain-point-y' style='width:50px' value='' />
							<button id="btn-stain-position" onclick="ins(yc.ui.editer.WorldEditer).stain.locateStainPoint()">定位</button>
							<br />
						</div>
					
						<div style="clear:both"></div>

					</div>

					<div style="clear:both"></div>
				</div>
			</div>
			
			
			
			<div id='panel-pinups'>
				<div style="float:left">
					前景层：
					<button onclick="ins(yc.ui.editer.WorldEditer).pinup.createPinup('foreground')">+</button>
					<button onclick="ins(yc.ui.editer.WorldEditer).pinup.removePinup('foreground')">-</button>
					<br />
					<select size="11" id="lst-pinup-foreground" style="width:120px"></select>
					<br />
					
					背景层：
					<button onclick="ins(yc.ui.editer.WorldEditer).pinup.createPinup('background')">+</button>
					<button onclick="ins(yc.ui.editer.WorldEditer).pinup.removePinup('background')">-</button>
					<br />
					<select size="11" id="lst-pinup-background" style="width:120px"></select>
					<br />
				</div>			

				<div style="float:left;margin-left:20px">
					坐标 x:<input id='ipt-pinup-x' style='width:30px' value='' format="int" />
					y:<input id='ipt-pinup-y' style='width:30px' value='' format="int" />
					旋转:<input id='ipt-pinup-rotation' style='width:40px' value='' format="float" />
					<br />

					锚点 x:<input id='ipt-pinup-anchor-x' style='width:30px' value='' format="float" />
					y:<input id='ipt-pinup-anchor-y' style='width:30px' value='' format="float" />
					透明:<input id='ipt-pinup-opacity' style='width:40px' value='' format="int" />
					<br />

					缩放 x:<input id='ipt-pinup-scale-x' style='width:30px' value='' format="float" />
					y:<input id='ipt-pinup-scale-y' style='width:30px' value='' format="float" />
					<br />

					Img Url<input id='ipt-pinup-img-url' style='width:150px' value='' />
					<br />

					<label>
						<input id="ipt-pinup-tile" type="checkbox" />
						平铺
					</label>
					宽<input id="ipt-pinup-tile-width" style="width:40px" format="int" value="100" />
					高<input id="ipt-pinup-tile-height" style="width:40px" format="int" value="100" />
					<br />

					文本<input id='ipt-pinup-text' style='width:170px' value='' /><br />
					文本样式<input id='ipt-pinup-text-style' style='width:150px' value='' /><br />
					文本颜色<input id='ipt-pinup-text-color' style='width:70px' value='' /><br />

					<label style="margin-right:20px">
						<input id="ipt-pinup-mosey" type="checkbox" />“漫步”
					</label>

					<label style="">
						“漫步”范围:<input id="ipt-pinup-mosey-area" value="300" format="float" style="width:30px" />
					</label>

					<br />
					速度(point/sec)<input id="ipt-pinup-mosey-speed" value="10" format="float" style="width:30px" />

					<br />
					视差：<input id="ipt-pinup-parallax" value="1" format="float" />
				</div>

				<div style="clear:both"></div>
			</div>

			
			<div id='panel-roles'>
				<div>
					<b>氨基酸</b>
					<button onclick="ins(yc.ui.editer.WorldEditer).role.createAminoAcid()">+ ♪</button>
					<button onclick="ins(yc.ui.editer.WorldEditer).role.removeAminoAcid()">- ♪</button>
					<label>
						<input type="checkbox" checked onclick="yc.settings.outer.aminoacid.dbgInfo=!yc.settings.outer.aminoacid.dbgInfo" /> 辅助信息(debug)
					</label>

					<div>
						<div style="float:left;" >
							<select size="6" id="lst-roles-aminoacid"  style="width:120px"></select>
						</div>

						<div id="props-aminoacid" style="float:left; margin-left:5px;">
							类型:<select id="sel-aminoacid-type">
								<option value="red" style="color:red">red</option>
								<option value="yellow" style="color:yellow">yellow</option>
								<option value="blue" style="color:blue">blue</option>
							</select>
							<br />
							数量：<input id="ipt-aminoacid-num" style="width:40px" format="int" />
							<br />
							坐标 x:<input id='ipt-aminoacid-x' style='width:40px' value='' format="int" />
							y:<input id='ipt-aminoacid-y' style='width:40px' value='' format="int" />
						</div>
						
						<div style="clear:both"></div>
					</div>
				</div>

				<hr />


				<b>病毒群</b>
				<button onclick="ins(yc.ui.editer.WorldEditer).role.createVirusCluster()">+</button>
				<button onclick="ins(yc.ui.editer.WorldEditer).role.removeVirusCluster()">-</button>
				<button onclick="ins(yc.ui.editer.WorldEditer).role.copyVirusCluster()">copy</button>
				<label>
					<input type="checkbox" checked onclick="yc.settings.outer.virus.dbgInfo=!yc.settings.outer.virus.dbgInfo" /> 辅助信息(debug)
				</label>

				<div>
					<select size="18" id="lst-roles-virusclusters"  style="float:left;width:80px"></select>

					<div id="props-viruscluster" style="float:left; margin-left:5px;">

						<div style="float:left">
							精灵: <select id='sel-viruscluster-spriter' style='width:120px' value='' onchagne="" class="animations-list"></select>
							<br />

							坐标 x:<input id='ipt-viruscluster-x' style='width:40px' value='' format="int" />
							y:<input id='ipt-viruscluster-y' style='width:40px' value='' format="int" />
							<br />

							转向<input id='ipt-viruscluster-turnRate' style='width:40px' value='' format="float" />
							警视<input id='ipt-viruscluster-vigilanceRange' style='width:40px' value='' format="int" />
							<br />

							漫步速度：<input id='ipt-viruscluster-moseySpeed' style='width:30px' value='' format="float" />
							<br />
							追击速度：<input id='ipt-viruscluster-normalSpeed' style='width:30px' value='' format="float" />

							<br />
							体积半径：<input id='ipt-viruscluster-size' style='width:30px' value='' format="int" />

						</div>

						<div style="float:left; margin-left:5px">
							<label>
								解锁关卡<input id="ipt-viruscluster-unlock-level" style="width:80px" />
							</label>

							<div>
								掉落DNS
								<br />
								<select multiple id="lst-boss-dna" size="4">
									
								</select>
							</div>
						</div>

						<div style="clear:both"></div>
						<hr />

						<div>
							<h3 style="float:left">病毒队列</h3>
							<spane style="float:right" id="spn-virus-num"></spane>
							<div style="clear:both"></div>
						</div>

						<button onclick="ins(yc.ui.editer.WorldEditer).role.createVirus()">+</button>
						<button onclick="ins(yc.ui.editer.WorldEditer).role.removeVirus()">-</button>
						<button onclick="ins(yc.ui.editer.WorldEditer).role.copyVirus()">copy</button>
						<button onclick="ins(yc.ui.editer.WorldEditer).role.order(-1)">↑</button>
						<button onclick="ins(yc.ui.editer.WorldEditer).role.order(1)">↓</button>
						<br />
						<div>
							<select size="8" id="lst-roles-virus-queue"  style="float:left;width:150px"></select>
					
							<div style="float:left;margin-left:6px">

								精灵: <input id='ipt-virus-spriter' style='width:105px' value='' />
								<br />

								掉落:
								<select id='sel-virus-flop'>
									<option value="red" style="color:red">red</option>
									<option value="yellow" style="color:yellow">yellow</option>
									<option value="blue" style="color:blue">blue</option>
								</select>
								<input id='ipt-virus-flop-num' style='width:30px' value='0' format="int" />
								<br />

								HP: <input id='ipt-virus-hp' style='width:30px' value='' format="int" />
								<br />
								速度: <input id='ipt-virus-speed' style='width:30px' value='' format="int" />
								<br />
								等待: <input id='ipt-virus-wait' style='width:30px' value='' format="float" />sec
								<br />
								特殊能力：
								<br />
								<label>
									<input type="checkbox" disabled />
									分裂
								</label>
								<br />
								<label>
									<input type="checkbox" disabled />
									潜行
								</label>
							</div>

							<div style="clear:both"></div>
						</div>


					</div>
					
					<div style="clear:both"></div>
				</div>

			</div>

			<!-- 细胞 -->
			<div id="panel-cell">
				<div>
					<div>氨基酸</div>
					数量：
					<input value="10" />
					颜色：
					<select>
						<option value='red'>red</option>
						<option value='yellow'>yellow</option>
						<option value='blue'>blue</option>
						<option selected="selected" value='all'>全部</option>
					</select>
					<a href='#' onclick="ins(yc.ui.editer.WorldEditer).increaseAminoAcid(this);return false;">增加</a>
				</div>
				<div>
					<div>蛋白质</div>
					数量：
					<input value="10" />
					颜色：
					<select>
						<option value='red'>red</option>
						<option value='yellow'>yellow</option>
						<option value='blue'>blue</option>
						<option value='orange'>orange</option>
						<option value='green'>green</option>
						<option value='violet'>violet</option>
						<option selected="selected" value='all'>全部</option>
					</select>
					<a href='#' onclick="ins(yc.ui.editer.WorldEditer).increaseProtein(this);return false;">增加</a>
				</div>
			</div>
			
		</div>
	</div>
	
	
	<!-- 场景：关卡选择 -->
	<div id="ui-levels-selector">
		<div id="ui-levels-selector-title">
			<h1>I, Cell</h1>
			<p>You are a cell under someone's microscope ……</p>
		</div>

		<div id="ui-levels-selector-login">

			<div>
				<a id="weibo_auth_login" href="javascript:;" >
					<img src="res/weibo_login.png" title="点击进入授权页面" alt="点击进入授权页面" border="0" width="119" height="24"/>
				</a>
			</div>
			<div>
				<a id="loginWithTestUser" href="#">
					TEST
				</a>
			</div>

		</div>

		
		<div id="ui-levels-selector-menu" class="">
			<ul>
				<li>
					<button onclick="$('#ui-levels-selector-menu,#ui-buildin-levels-menu').slideToggle();">故事模式</button>
				</li>
				<li>
					<button onclick="worldList()">探索模式</button>
					<!--<img src='http://ww1.sinaimg.cn/large/73b3a2a7gw1dxke15bzf3j.jpg'/>-->
				</li>
				<br />
				<li>
					<button onclick="cc.Director.getInstance().replaceScene( new yc.levels.FreeWorld ); $('#ui-levels-selector').toggle();">
						随机关卡
					</button>
				</li>
			</ul>
		</div>

		<div id="ui-buildin-levels-menu" style="display:none">
			<ul>
				<li>
					<button onclick="yc.levels.LevelSelector.enterLevel(yc.levels.c1.tutorial)">教学关卡</button>
				</li>
				<li>
					<button onclick="yc.levels.LevelSelector.enterLevel(yc.levels.c1.l1)">Lv 1</button>
				</li>
				<li>
					<button disabled>Lv 2</button>
				</li>
				<li>
					<button disabled>Lv 3</button>
				</li>
				<hr />
				<li>
					<button onclick="$('#ui-levels-selector-menu,#ui-buildin-levels-menu').slideToggle();">返回</button>
				</li>
			</ul>
		</div>

		<div id="worldListDiv">
			<div id="worldListDiv_title">
				<a id="worldListDiv_newMapBtn" href="#"  onclick="$('#worldListDiv').dialog('close');yc.levels.LevelSelector.enterLevel(yc.levels.creater);return false;">Create my world</a>
				<h2>world list</h2>
			</div>
			<div id="worldListDiv_list">
			</div>
		</div>

	</div>
</body>
</html>
